<template>
	<view class="page-body paround40">
		<view class="uploadImg " data-uploadid="1" @click="UploadImg"> 
			<view class="flex ipt-wrap">
				<span>身份证(正面)</span>
				<!-- <em>未上传</em> -->
				<i class="icon xiangyou"></i>
			</view>
			<view class="flex pic">
				<image class=" bgwrap" :src='sfzFront'></image> 
			</view>
			<view class="note">
				<view>1、请手持相关证件，临时身份证有效期15天以上</view>
				<view>2、照片支持jpg格式最大不超过1M</view>
			</view>
		</view>
		<view class="uploadImg" data-uploadid="2" @click="UploadImg">
			<view class="flex ipt-wrap">
				<span>身份证(反面)</span>
				<!-- <em>未上传</em> -->
				<i class="icon xiangyou"></i>
			</view>
			<view class="flex pic">
				<image class="bgwrap" :src='sfzReverse'></image>            
			</view>
			<view class="note">
				<view>1、身份证有效期需要在1个月以上</view>
				<view>2、照片必须能看清有效期</view>
				<view>3、照片支持jpg格式最大不超过1M</view>
			</view>
		</view>
		<view class="uploadImg" data-uploadid="3" @click="UploadImg">
			<view class="flex ipt-wrap">
				<span>统一社会信用代码证</span>
				<!-- <em>未上传</em> -->
				<i class="icon xiangyou"></i>
			</view>
			<view class="flex pic">
				<image class="bgwrap" :src='unified_code'></image>            
			</view>
			<view class="note">
				<!-- <view>1、</view> -->
			</view>
		</view>
		<view :class="['button btn-next',isNextStep?'primary':'disabled']" :disabled="!isNextStep" @click="nextStep">提交</view>
	</view>
</template>

<script>
	var that;
	import {Pages,TimeStorage} from '@/utils/utils.js';
	import {host} from '@/utils/Config.js';
	import {Base64} from '@/utils/base64.js';
	var wv;
	export default{
		data(){
			return{
				sfzFront:"",
				sfzReverse:"",
				unified_code:"",
				sfzFrontbase64:"",
				sfzReversebase64:"",
				unified_codebase64:"",
				isNextStep:false,
			}
		},
		onLoad(options){
			// #ifdef APP-PLUS
			plus.nativeUI.showWaiting();
			// #endif
			that=this;
		},
		onReady(){
			// #ifdef APP-PLUS
			plus.nativeUI.closeWaiting();
			// #endif
				
		},
		onShow(options){
			
		},
		computed:{

		},
		methods:{
			UploadImg(e){
				let id = e.currentTarget.dataset.uploadid;
				var name = "";
				var baseName = ""
				if(id==1){
					name = "sfzFront";
					baseName = "sfzFrontbase64";
				}else if(id==2){
					name = "sfzReverse";
					baseName = "sfzReversebase64";
					
				}else if(id==3){
					name = "unified_code";
					baseName = "unified_codebase64";
				}
				uni.chooseImage({
					count:1,
					sizeType:['original', 'compressed'],
					success: function(res) {
						console.log(res)
						var tempFilePath = res.tempFilePaths[0];
						// #ifdef H5
							that[name] = tempFilePath;
						// #endif
						that[name] = tempFilePath;
						that[baseName] = evt.target.result;
						//#ifdef APP-PLUS
						plus.io.resolveLocalFileSystemURL(tempFilePath, function( entry ) {
						// 可通过entry对象操作test.html文件
						var src = entry.toLocalURL();
							entry.file( function(file){
								var fileReader = new plus.io.FileReader();
								fileReader.readAsDataURL( file );
								fileReader.onloadend = function(evt) {
									// console.log(evt.target.result)
									that[name] = tempFilePath;
									that[baseName] = evt.target.result;
								}
							})
						})
						// #endif
					}
				})
				// #ifdef H5
				
				// #endif
			},
			nextStep(){
				// uni.navigateTo({
				// 	url:"/pages/MerchantsIn/Merchantsuccess"
				// })
				// return
				if(this.sfzFrontbase64==""){
					this.$showToast('请上传身份证正面照')
					return false;
				}
				if(this.sfzReversebase64==""){
					this.$showToast('请上传身份证反面照')
					return false;
				}
				if(this.unified_codebase64==""){
					this.$showToast('请上传统一社会信用代码证')
					return false;
				}
				this.$https.POST({
					url:'/pay/uploadPhotos',
					data:{
						id_emblem:that.sfzReversebase64,
						id_portrait:that.sfzFrontbase64,
						unified_code:that.unified_codebase64,
						filetype:'jpg'
					},
					success(res){
						that.$showToast('提交成功，等待审核')
						setTimeout(()=>{
							uni.navigateTo({
								url:"/pages/MerchantsIn/Merchantsuccess"
							})
						},800)
					},
					showfailsure(res){
					}
				})
			}
		},
		onBackPress(options) {
			// uni.$emit('backpress')
		}
		
	}
</script>

<style lang="scss" scoped="">
	page{background: #fff;}
	.xiangyou{font-size: 28upx;}
	.ipt-wrap{line-height: 80upx;height: 80upx;}
	.uploadImg{
	    position: relative;
	}
	.uploadImg .ipt-wrap{justify-content: space-between;}
	.uploadImg  em{
	        color: #ccc;
	        padding-right: 40rpx;
	    }
	.uploadImg .ipt-upImg{
	        position: absolute;
	        width: 100%;
	        height: 100%;
	        opacity: 0;
	        left: 0;
	    }
	   .uploadImg em.uped{
	        color: #545459;
	    }
	  .uploadImg  .pic{padding:20rpx 50rpx;justify-content: space-between;box-sizing: border-box;background: #fff;}
	   .uploadImg .bgwrap{
	        width: 320rpx;
	        height: 220rpx;
	        background-size:100% ;
	        overflow: hidden;     
			background: #f6f6f6;
			margin: 0 auto;
	    }
	   .uploadImg .suchPic{
	        text-align: center;
	        line-height: 40rpx;
	        color: #aaa;
	        align-self: center;
	        padding-right: 40rpx;
	        
	    }
	    .uploadImg .suchPic image{
	        width: 210rpx;
	        height: 150rpx;
	    }
	   .uploadImg .note{background: #fff;padding:0 35rpx ;box-sizing: border-box;line-height: 40rpx;color: #666;padding-bottom: 10rpx;}

	.button{margin-top:40upx; margin-bottom: 60upx;}
</style>
